<template>
  <div>
    <el-table
        :data="tableData"
        border
        style="width: 100%"
    >
      <el-table-column type="index" label="编号"/>
      <el-table-column
          prop="ruleName"
          label="规则"
      >
      </el-table-column>
      <el-table-column
          prop="remark"
          label="描述"
      >
      </el-table-column>
      <el-table-column prop="statusStr" label="状态">
      </el-table-column>
      <el-table-column
          fixed="right"
          label="操作"
      >
        <template scope="scope">
          <el-switch
              active-color="#13ce66"
              inactive-color="#c0c0c0"
              active-text="启用"
              inactive-text="关闭"
              active-value="1"
              inactive-value="0"
              v-model="scope.row.status"
              @change="changeStatus($event,scope.row)">
          </el-switch>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import axios from "axios";
import {Message} from "element-ui";

export default {
  name: "leaveRule",
  components: {},
  created() {
    this.query();
  },

  methods: {
    changeStatus(status, row) {
      let url = "";
      if (status == 0) {
        url = this.$BASE_URL + "/leaveRule/stopRule"
      } else {
        url = this.$BASE_URL + "/leaveRule/startRule"
      }
      axios({
        url: url,
        params: {
          ruleId: row.id
        },
        headers: {
          token: localStorage.getItem("token")
        }
      }).then(resp => {
        if (resp.data.code === 200) {
          Message.success(resp.data.msg)
          this.query()
        } else {
          Message.error(resp.data.msg)
          this.query()
        }

      }, err => {
        Message.error(err.msg)
        this.query()
      })
    },

    query() {
      axios({
        url: this.$BASE_URL+"/leaveRule/getRuleList",
        headers: {
          token: localStorage.getItem("token")
        }
      }).then(resp => {
        if (resp.data.code === 200) {
          this.tableData = resp.data.data.list;
          this.total = resp.data.data.total;

        } else {
          Message.error(resp.data.msg)
        }

      }, err => {
        Message.error(err.msg)
      })
    }
  },
  data() {
    return {
      total: 0,
      formInline: {},
      tableData: []
    }
  }
}
</script>
<style scoped>
</style>
